﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=no,
    width=device-width,initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="assets/style-pho/css.css">
    <link rel="stylesheet" href="assets/style-pho/all.css">
    <link rel="stylesheet" href="assets/style-pho/jingxuananli.css">
    <link rel="stylesheet" href="assets/lib-pho/swiper-5.2.0/package/css/swiper.min.css">
    <script src="assets/lib-pho/jquery-3.4.1.min.js"></script>
    <script src="assets/lib-pho/swiper-5.2.0/package/js/swiper.min.js"></script>
    <title>Document</title>
    <style>
        /* 设置鼠标悬浮时查看按钮 */
        /* .anli :hover {
            background-color: red;
        } */
        /* .anli :hover {
            z-index: 1;
            opacity: 1;
        } */
    </style>
</head>

<body>
    <!-- 滚动条问题在下面出现 ↓
        1.不是盒子宽度过大问题
    -->

    <!-- <div class="wenti-box"> -->
    <!-- 第一部分 -->
    <div class="main1">
        <!-- 菜单栏页面 -->
        <div class="menua">
            <!-- 关闭按钮 -->
            <p>
                <a class="close"></a>
            </p>
            <div>
                {dede:include filename="nav-pho.htm"/}
            </div>
        </div>
        <div class="swhz-banner">
            <!-- 展开按钮 -->
            <div class="nav">
                <img src="assets/images-pho/Logo.png" width="52px" height="20px" />
                <a class="menu"></a>
            </div>
        </div>
    </div>

    <!-- 第二部分 -->
    <div class="swiper-container jxal-banner">
        <div class="swiper-wrapper">
            <div class="swiper-slide">Slide 1</div>
            <div class="swiper-slide">Slide 2</div>
            <div class="swiper-slide">Slide 3</div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>
    </div>

    <div class="jxal-container">

        <!-- 方鸡代码 -->
        <div style="width: 100%;">
            <div class="padding-sm justify-center">
                <div class="flex radius-xl bg-white align-center shadow shadow-blur f-width">
                    <div class=" flex-sub padding  " style="white-space: nowrap;">分类:</div>
                    <div class="padding f-width " style="overflow: scroll;">
                        <ul class="flex align-center f-width " style="white-space: nowrap;">
                            <!-- <li class="margin-right-sm"><a href="#">全部</a></li>
                            <li class="margin-right-sm"><a href="#">APP</a></li>
                            <li class="margin-right-sm"><a href="#">网站</a></li>
                            <li class="margin-right-sm">
                                <a href="#">软件界面</a>
                            </li>
                            <li class="margin-right-sm"><a href="#">管理系统</a></li>
                            <li class="margin-right-sm"><a href="#">大数据可视化</a></li> -->

                            <li><a href="list.php?tid=2 " style="margin-right: 10px;">全部</a></li>
                            {dede:channel row="5 " type="son " col="1 " typeid="7 "}
                            <li class="margin-right-sm"><a href="list.php?tid=[field:ID /] ">[field:typename/]</a></li>
                            {/dede:channel}

                        </ul>
                    </div>
                </div>

            </div>
        </div>

        <!--  -->


        <!-- <div>
            <div class="img ">
                <div class="font ">

                    <a href="[field:arcurl/] ">查看</a>
                </div>

                <img src="[field:picname/] " />
                <p><span>[field:title/]</span> <span><img src="[field:global.cfg_templeturl/]/default/images/small-eyes.png " alt="点击数 ">[field:click/]</span></p>
            </div>
        </div> -->


        <!--  -->
        {dede:list pagesize="8 " typeid="7 "}
        <div class="anli">
            <div>
                <div class="img">


                    <a href="view.php?aid=[field:ID/]"> <img src="[field:picname/]" /></a>
                    <p><span>[field:title/]</span>
                        <!-- <span><img src="images-pho/small-eyes.png" alt="">2000</span> --></p>
                </div>
            </div>
        </div>
        {/dede:list}
        <ul class="page-next ">
            {dede:pagelist listitem="pre,pageno,next " listsize="5 "/}
            <!-- <li>
                <a>
                    <</a>
            </li>
            <li><a class="hover2 ">1</a></li>
            <li><a>2</a></li>
            <li><a>3</a></li>
            <li><a>></a></li> -->
            {dede:prenext get='next'/}
        </ul>
        <!--  -->
        <!-- 在这里继续写 -->

    </div>

    <!-- </div> -->

    {dede:include filename="footer-pho.htm"/}


    <script>
        function hover() {
            alert('hover me!');
        }



        var mySwiper = new Swiper('.swiper-container', {
            // direction: 'vertical', // 垂直切换选项
            autoplay: true,
            loop: true, // 循环模式选项

            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
            },

            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },


        })


        $(document).ready(function() {

            $(window).scroll(function() {
                console.log(123);
            });
        });
        // $('.main1').width($(window).width());
        // $('.main1').height($(window).height()); 不适用JS也有更好的方法

        // $('.menup').width($(window).width());
        // $('.menup').height($(window).height());

        $('.menu').click(function() {
            // alert(123);
            $('.menua').css("z-index", "2");
            $('body').css('overflow', 'hidden'); //禁止滚动
            $(this).css('visibility', 'hidden'); //禁止滚动


        });
        $('.menua').click(function() {
            $('.menua').css("z-index", "-1");
            $('.menua ul').css("z-index", "-1");
            $('body').css('overflow', 'auto'); //允许滚动
            $('.menu').css('visibility', 'visible'); //禁止滚动

        });
    </script>
</body>

</html>